<!DOCTYPE html>
<html>
        <head>
                <meta charset="utf-8"> 
                <title>Bootstrap 实例 - 一个简单的网页</title>
                <link rel="stylesheet" href="https://cdn.staticfile.org/twitter-bootstrap/3.3.7/css/bootstrap.min.css">  
                <script src="https://cdn.staticfile.org/jquery/2.1.1/jquery.min.js"></script>
                <script src="https://cdn.staticfile.org/twitter-bootstrap/3.3.7/js/bootstrap.min.js"></script>
                <style>
                .fakeimg {
                    height: 200px;
                     background: #aaa;
                }
              </style>
            </head>
            
            
            <nav class="navbar navbar-inverse">
              <div class="container-fluid">
                <div class="navbar-header">
                  <button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#myNavbar">
                    <span class="icon-bar"></span>
                    <span class="icon-bar"></span>
                    <span class="icon-bar"></span>                        
                  </button>
                  <a class="navbar-brand" href="#">2019新番动漫大全</a>
                </div>
                <div class="collapse navbar-collapse" id="myNavbar">
                  <ul class="nav navbar-nav">
                    <li class="active"><a href="file:///C:/Users/26565/Desktop/%E6%96%B0%E5%BB%BA%E6%96%87%E4%BB%B6%E5%A4%B9%20(2)/index.html">首页</a></li>
                      <li class="dropdown">
                            <a href="#" class="dropdown-toggle" data-toggle="dropdown">
                                类型 
                                <b class="caret"></b>
                            </a>
                            <ul class="dropdown-menu">
                                <li><a href="#">搞笑</a></li>
                                <li><a href="#">科幻</a></li>
                                <li><a href="#">推理</a></li>
                                <li class="divider"></li>
                                <li><a href="#">校园</a></li>
                                <li class="divider"></li>
                                <li><a href="#">热血</a></li>
                            </ul>
                        </li>
                    <li><a href="#">剧场版</a></li>
                    <li><a href="#">漫画</a></li>
                  </ul>
                </div>
              </div>
            </nav>
	<style>
		#box{
			width: 370px;
			height: 400px;
			border: 1px solid #E2E3E5;
			position: absolute;
			left: 50%;
			top: 50%;
			margin-left: -185px;
			margin-top: -200px;
		}
		#logo{
			width: 370px;
			height: 95px;
			font-size: 30px;
			color: #676A6C;
			line-height: 95px;
			margin-left: 40px;
		}
		#user{
			width: 295px;
			height: 50px;
			margin-left: 40px;
		}
		#pass{
			width: 295px;
			height: 50px;
			margin-left: 40px;
		}
		.input-group{
			margin-left: 40px;
		}
		#img-submit {
			width: 95px;
			height: 30px;
			margin-top: 15px;
			border-radius: 2px;
			cursor: pointer;
			position: absolute;
			z-index: 3;
			left: 10px;
			top: 0;
		}
		#validateCode {
			height: 55px;
			padding-left: 120px;
			width: 295px;
		}
		#verify{
			width: 295px;
			height: 60px;
			margin-left: 40px;
			border: 1px solid #EDEDEE;
		}
		#btn-login{
			width: 295px;
			height: 50px;
			margin-left: 40px;
			margin-top: 20px;
		}
		#remember{
			width: 80px;
			height: 20px;
			margin-left: 50px;
			margin-top: 20px;
			color: #676A6C;
			font-size: 15px;
		}
	</style>
	
	<head>
		<meta charset="UTF-8">
		<title>登录页面</title>
		<meta name="description" content="particles.js is a lightweight JavaScript library for creating particles.">
		<meta name="author" content="Vincent Garreau" />
		<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no">
		<link rel="stylesheet" href="../bootstrap.min.css">
		<script src="jquery.min.js"></script>
		<script src="particle.js"></script>
	</head>
	<body>
		<canvas class="particle"></canvas>
		<div id="box">
			<div id="logo">欢迎登陆！</div>
			<div id="info">
				<input type="text" class="form-control" id="user" placeholder="账号:">
				<input type="password" class="form-control" id="pass" placeholder="密码:">
				<div class="input-group">
					<img id="img-submit" >
 
					
				</div>
 
				<button class="btn btn-info" id="btn-login" onclick="VerifyLogin()">登录</button>
				<div id="remember">记住登陆 <input type="checkbox"></div>
			</div>
		</div>
	</body>
</html>